/*!
 *       __ _____                     ________                              __
 *      / // _  /__ __ _____ ___ __ _/__  ___/__ ___ ______ __ __  __ ___  / /
 *  __ / // // // // // _  // _// // / / // _  // _//     // //  \/ // _ \/ /
 * /  / // // // // // ___// / / // / / // ___// / / / / // // /\  // // / /__
 * \___//____ \\___//____//_/ _\_  / /_//____//_/ /_/ /_//_//_/ /_/ \__\_\___/
 *           \/              /____/                              version {{VER}}
 * http://terminal.jcubic.pl
 *
 * This file is part of jQuery Terminal.
 *
 * Copyright (c) 2010-2025 Jakub T. Jankiewicz <https://jcubic.pl/me>
 * Released under the MIT license
 *
 * Date: {{DATE}}
 */
.terminal .terminal-output .format, .cmd .format,
.cmd-prompt, .cmd-prompt div {
    display: inline-block;
}
.terminal h1, .terminal h2, .terminal h3, .terminal h4, .terminal h5, .terminal h6, .terminal pre, .cmd {
    margin: 0;
}
.cmd .cmd-clipboard {
    position: absolute !important;
    left: -16px;
    left: calc(-16px / var(--pixel-density, 1)) !important;
    top: 0 !important;
    width: 16px;
    height: 16px;
    width: calc(16px / var(--pixel-density, 1)) !important;
    height: calc(16px / var(--pixel-density, 1)) !important;
    background: transparent !important;
    border: none !important;
    color: transparent !important;
    outline: none !important;
    padding: 0 !important;
    resize: none !important;
    box-shadow: none !important;
    z-index: 1000 !important;
    overflow: hidden !important;
    white-space: pre !important;
    text-indent: -9999em !important; /* better cursor hiding for Safari and IE */
    top: calc(var(--cursor-line, 0) * var(--size, 1) * (14px / var(--pixel-density, 1))) !important;
}
.cmd .visually-hidden, .cmd .cmd-clipboard {
    user-select: none;
}
.visually-hidden {
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    height: 1px;
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
    user-select: none;
    width: 1px;
    top: 0;
    left: 0;
}
.cmd span.cmd-end-line,
.cmd span.cmd-end-line span,
.cmd div.cmd-end-line span[data-text]:last-child,
.cmd div.cmd-end-line span[data-text]:last-child span,
.cmd textarea,
.cmd .cursor + span:empty {
    -webkit-touch-callout: none; /* iOS Safari */
      -webkit-user-select: none; /* Safari */
       -khtml-user-select: none; /* Konqueror HTML */
         -moz-user-select: none; /* Firefox */
          -ms-user-select: none; /* Internet Explorer/Edge */
              user-select: none; /* Non-prefixed version, currently supported by Chrome and Opera */
}
.terminal img, .terminal audio, .terminal object, .terminal canvas {
    cursor: default;
}
.terminal {
    position: relative;
    line-height: initial;
    --base-background: var(--background, #000);
    --base-color: var(--color);
    contain: content;
}
.terminal-scroller {
    position: relative;
    overflow-y: auto;
    scrollbar-gutter: stable;
    height: 100%;
    box-sizing: border-box;
    overflow-x: hidden;
}
terminal.terminal-temp {
    visibility: hidden;
}
body.terminal {
    min-height: 100vh;
    height: 100%;
}
html {
    height: 100%;
}
body.terminal, body.full-screen-terminal {
    margin: 0;
    height: 100%;
}
body.full-screen-terminal .terminal:not(.terminal-external) {
    height: 100% !important;
}
body.full-screen-terminal {
    height: 100%;
    height: var(--terminal-force-height, 100dvh);
}
.terminal > div.terminal-fill {
    min-height: 100%;
    height: 100%;
}
.terminal > .terminal-pixel {
    position: absolute;
    display: inline;
    left: -2px;
    top: -2px;
    width: 1px;
    height: 1px;
}
.terminal > .terminal-resizer,
.terminal > .terminal-font .terminal-resizer {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
    z-index: -1 !important;
    height: 100% !important;
    border: none !important;
    padding: 0 !important;
    width: 100% !important;
}
.cmd {
    padding: 0;
    position: relative;
    width: 100%;
    z-index: 300;
}
.terminal .cmd, .terminal .cmd div {
    background: transparent !important;
}
.terminal a[tabindex="1000"],
.terminal a[tabindex="1000"]:active,
.terminal a[tabindex="1000"]:focus {
    outline: none;
}
.terminal .inverted, .cmd.cmd.cmd .inverted,
.terminal .terminal-inverted, .cmd.cmd.cmd .cmd-inverted {
    background-color: #aaa !important;
    color: #000 !important;
}
.terminal .terminal-output > :not(.raw) a[href],
.cmd a[href],
.terminal.external a[href] {
    color: #3377FF;
    color: var(--link-color, #3377FF);
    cursor: pointer;
}
.cmd a[href]:not(.terminal-inverted),
.terminal .terminal-output > :not(.raw) a[href]:not(.terminal-inverted),
.terminal.external a[href]:not(.terminal-inverted) {
    --color: var(--link-color, #3377FF);
    /* conditionals: https://www.kizu.ru/conditions-for-css-variables/ */
    /* --glow: 0; */
    text-shadow: 0 0 calc(var(--glow) * 5px) var(--color, #ccc);
}
.terminal .terminal-output > :not(.raw) a[href].terminal-inverted,
.terminal.external a[href].terminal-inverted {
    background: var(--color, #ccc);
    /* conditionals: https://www.kizu.ru/conditions-for-css-variables/ */
    /* --glow: 0; */
    text-shadow: 0 0 calc(var(--glow) * 5px) var(--background, #000);
}
.terminal .terminal-output > :not(.raw) a[href]:hover,
.cmd a[href]:hover,
.terminal.external a[href]:hover {
    background-color: #3377FF;
    background-color: var(--link-color, #3377FF) !important;
    color: #000;
    color: var(--base-background, #000) !important;
    text-decoration: none;
}
/*
 * make text on hover links visible when background is transparent #990
 */
@container style(--background: transparent) {
  .terminal .terminal-output > :not(.raw) a[href]:hover,
  .cmd a[href]:hover,
  .terminal.external a[href]:hover {
    --base-background: black;
  }
}
.terminal .terminal-output > :not(.raw) a[href] span,
.cmd a[href] span,
.terminal.external a[href] span {
    /*
     * shorter and simple solution
     * it's hard to overwrite long :not selector (:not(a span) don't work)
     */
    color: #3377FF !important;
    --color: var(--link-color, #3377FF);
    color: var(--link-color, #3377FF) !important;
    text-decoration: underline;
}
.terminal .terminal-output > :not(.raw) a[href]:hover span,
.cmd a[href]:hover span,
.terminal.external a[href]:hover span {
    background-color: #3377FF !important;
    background-color: var(--link-color, #3377FF) !important;
    color: #000 !important;
    color: var(--background, #000) !important;
    text-decoration: none;
}
.terminal a[href] {
    transition-property: color, background-color;
    transition-duration: 0.2s;
    transition-timing-function: ease-out;
}
.cmd .cmd-cursor {
    display: inline-block;
}
.cmd .cmd-cursor-line > span,
.cmd .cmd-cursor-line img {
    display: inline-block;
}
.cmd .cmd-cursor.cmd-blink > span[data-text]:not(.emoji):not(.fa):not(.far):not(.fas) span,
.cmd .cmd-cursor.cmd-blink a,
.cmd .cmd-cursor.cmd-blink .fa,
.cmd .cmd-cursor.cmd-blink .far,
.cmd .cmd-cursor.cmd-blink .fas,
.cmd .cmd-cursor .emoji {
        -webkit-animation: terminal-blink 1s infinite linear;
           -moz-animation: terminal-blink 1s infinite linear;
            -ms-animation: terminal-blink 1s infinite linear;
                animation: terminal-blink 1s infinite linear;
}
.bar.terminal .inverted, .bar.cmd .cmd-inverted {
    box-shadow: -2px 0 0 -1px #aaa;
    box-shadow: -2px 0 0 -1px var(--original-color, #aaa);
}
.terminal, .terminal .terminal-output > div > div, .cmd .cmd-prompt {
    display: block;
    height: auto;
}
.terminal .terminal-output > div:not(.raw) div {
    white-space: nowrap;
    clear: both;
}
.cmd .cmd-prompt > span, .cmd .cmd-prompt > a, .cmd .cmd-prompt:empty {
    float: left;
}
.cmd-prompt [data-text] > span, .cmd-wrapper > div {
    white-space: pre;
}
.cmd [data-text] span,
.terminal [data-text] span {
    display: inline-block;
}
.terminal-ouput span[style*="width"] {
    min-height: 14px;
    min-height: calc(var(--size, 1) * (14px / var(--pixel-density, 1)));
}
.terminal .terminal-output > :not(.raw) > div,
.cmd div,
.terminal.external div {
    line-height: 1em;
}
.cmd .cmd-prompt span.fa::before,
.cmd .cmd-prompt span.fab::before,
.cmd .cmd-prompt span.fad::before,
.cmd .cmd-prompt span.fal::before,
.cmd .cmd-prompt span.far::before,
.cmd .cmd-prompt span.fas {
    position: relative;
    top: 2px;
}
.terminal,
.terminal-output > :not(.raw),
.terminal-output > :not(.raw) span:not(.fas):not(.far):not(.fa),
.terminal-output > :not(.raw) a,
.cmd,
.terminal-font-forcer,
.cmd span:not(.fas):not(.far):not(.fa) {
    font-family: monospace;
    font-family: var(--font, monospace);
}
.terminal,
.cmd {
    font-size: 12px;
}
.terminal-output > div:not(.raw) div::before,
.cmd .cmd-line::before {
    content: '\0200B';
    width: 0;
    display: inline-block;
}
.cmd .cmd-line {
    white-space: nowrap;
}
.terminal span[data-text],
.cmd span[data-text] {
    display: inline-block;
}
.terminal, terminal-output > div:not(.raw) div > span:not(.token):not(.inverted):not(.terminal-inverted):not(.cmd-inverted):not(.terminal-error):not(.emoji),
.cmd span[data-text]:not(.cmd-inverted):not(.token):not(.emoji) {
    color: #aaa;
    background-color: #000;
}
.terminal span[data-text] span, .cmd span[data-text] span {
    text-decoration: inherit;
}
.terminal .ansi > div {
    line-height: 13px !important;
    line-height: calc(var(--size, 1) * (13px / var(--pixel-density, 1))) !important;
}
.cmd span.cmd-prompt, .cmd .cmd-prompt span {
    --background: transparent;
}
.terminal-output .emoji, .cmd .emoji {
    height: 12px;
    height: calc(12px / var(--pixel-density, 1));
    background-size: contain;
    background-repeat: no-repeat;
    color: transparent;
    position: relative;
}
.terminal .terminal-output .fa span,
.terminal .terminal-output .fas span,
.terminal .terminal-output .far span,
.cmd .fa span,
.cmd .fas span,
.cmd .far span {
    background: transparent !important;
    color: transparent !important;
    clip: rect(1px,1px,1px,1px);
    position: absolute;
}
.terminal-output .emoji,
.terminal-output .emoji span,
.cmd .emoji, .cmd .emoji span {
    display: inline-block;
    width: 2ch;
}
.terminal, .cmd {
    box-sizing: border-box;
}
.cmd .cmd-cursor span:not(.token):not(.inverted) {
    color: inherit;
    background-color: inherit;
}
.cmd .emoji.emoji.emoji.emoji, .cmd .emoji.emoji.emoji.emoji span {
    color: transparent;
    background-color: transparent;
}
.cmd .cmd-cursor * {
    background-color: transparent;
}
.terminal span[style*="width"] span,
.cmd span[style*="width"] span {
    width: inherit;
}
.cmd div {
    clear: both;
}
.cmd .cmd-prompt + div {
    clear: right;
}
terminal .terminal-output > div {
    margin-top: -1px;
}
.terminal-output > div.raw > div * {
    overflow-wrap: break-word;
    word-wrap: break-word;
}
.terminal .terminal-font {
    position: absolute;
    float: left;
    font-size: inherit;
    line-height: inherit;
    top: -100%;
    left: 0;
    margin-bottom: 1px;
}
.cmd > span:not(.cmd-prompt) {
    float: left;
}
.cmd .cmd-prompt span.cmd-line {
    display: block;
    float: none;
}
.terminal table {
    border-collapse: collapse;
}
.terminal td {
    border: 1px solid #aaa;
}
.cmd span[data-text]:not(.emoji):not(.fa):not(.fas):not(.far) span {
    background-color: inherit;
    color: inherit;
}
/* fix for underline on middle line */
.cmd [role="presentation"].cmd-cursor-line {
    position: relative;
    z-index: 100;
    cursor: text;
}
/* prompt above cursor line */
.cmd .cmd-prompt {
    position: relative;
    z-index: 200;
}
.cmd [role="presentation"]:not(.cmd-cursor-line) {
    overflow: hidden;
}
/*
 * this is set so animation can select original color as backgound for cursor
 * so span can have --color for selection
 */
.cmd {
    --original-color: var(
    --color, #aaa);
--original-background: var(
    --background);
}
.cmd a[href] {
    --original-color: var(--link-color, #3377FF);
}
/* DEFAULT ANIMATION */
@-webkit-keyframes terminal-blink {
    0%, 50% {
        background-color: #aaa;
        background-color: var(--original-color, #aaa);
        color: #000;
        color: var(--original-background, #000);
        -webkit-box-shadow: 0 0 calc(var(--glow) * 3px) var(--color, #aaa);
        box-shadow: 0 0 calc(var(--glow) * 3px) var(--color, #aaa);
    }
    50.1%, 100% {
        background-color: inherit;
        /* original background is set in emoji that need different style */
        color: inherit;
        color: var(--original-color, #aaa)
    }
}
@-moz-keyframes terminal-blink {
    0%, 50% {
        background-color: #aaa;
        background-color: var(--original-color, #aaa);
        color: #000;
        color: var(--original-background, #000);
        -webkit-box-shadow: 0 0 calc(var(--glow) * 3px) var(--color, #aaa);
        box-shadow: 0 0 calc(var(--glow) * 3px) var(--color, #aaa);
    }
    50.1%, 100% {
        background-color: inherit;
        color: inherit;
        color: var(--original-color, #aaa);
    }
}
@keyframes terminal-blink {
    0%, 50% {
        background-color: #aaa;
        background-color: var(--original-color, #aaa);
        color: #000;
        color: var(--original-background, #000);
        -webkit-box-shadow: 0 0 calc(var(--glow) * 3px) var(--color, #aaa);
        box-shadow: 0 0 calc(var(--glow) * 3px) var(--color, #aaa);
    }
    50.1%, 100% {
        background-color: inherit;
        color: inherit;
        color: var(--original-color, #aaa);
        -webkit-box-shadow: none;
        box-shadow: none;
    }
}
/* GLOW ANIMATION */
@-webkit-keyframes terminal-glow {
    0%, 50% {
        background-color: #aaa;
        background-color: var(--original-color, #aaa);
        color: #000;
        color: var(--original-background, #000);
        box-shadow: 0 0 3px #aaa;
        -webkit-box-shadow: 0 0 3px var(--color, #aaa);
        box-shadow: 0 0 3px var(--color, #aaa);
    }
    50.1%, 100% {
        background-color: inherit;
        color: inherit;
        -webkit-box-shadow: none;
        box-shadow: none;
    }
}
@-moz-keyframes terminal-glow {
    0%, 50% {
        background-color: #aaa;
        background-color: var(--original-color, #aaa);
        color: #000;
        color: var(--original-background, #000);
        box-shadow: 0 0 3px #aaa;
        -moz-box-shadow: 0 0 3px var(--color, #aaa);
        box-shadow: 0 0 3px var(--color, #aaa);
    }
    50.1%, 100% {
        background-color: inherit;
        color: inherit;
        -moz-box-shadow: none;
        box-shadow: none;
    }
}
@keyframes terminal-glow {
    0%, 50% {
        background-color: #aaa;
        background-color: var(--original-color, #aaa);
        color: #000;
        color: var(--original-background, #000);
        box-shadow: 0 0 3px #aaa;
        box-shadow: 0 0 3px var(--color, #aaa);
    }
    50.1%, 100% {
        background-color: inherit;
        color: inherit;
        box-shadow: none;
    }
}
/* BAR ANIMATION */
@-webkit-keyframes terminal-bar {
  0%, 50% {
      box-shadow: -2px 0 0 -1px #aaa;
      box-shadow: calc(var(--line-thickness, 2) * -1px) 0 0 -1px var(--original-color, #aaa);
  }
  50.1%, 100% {
      box-shadow: none;
  }
}
@-moz-keyframes terminal-bar {
  0%, 50% {
      box-shadow: -2px 0 0 -1px #aaa;
      box-shadow: calc(var(--line-thickness, 2) * -1px) 0 0 -1px var(--original-color, #aaa);
  }
  50.1%, 100% {
      box-shadow: none;
  }
}
@keyframes terminal-bar {
  0%, 50% {
      box-shadow: -2px 0 0 -1px #aaa;
      box-shadow: calc(var(--line-thickness, 2) * -1px) 0 0 -1px var(--original-color, #aaa);
  }
  50.1%, 100% {
      box-shadow: none;
  }
}
/* UNDERLINE ANIMATION */
@-webkit-keyframes terminal-underline {
  0%, 50% {
      box-shadow: 0 2px 0 #aaa;
      box-shadow: 0 calc(var(--line-thickness, 2) * 1px) 0 var(--original-color, #aaa);
  }
  50.1%, 100% {
      box-shadow: none;
  }
}
@-moz-keyframes terminal-underline {
  0%, 50% {
      box-shadow: 0 2px 0 #aaa;
      box-shadow: 0 calc(var(--line-thickness, 2) * 1px) 0 var(--original-color, #aaa);
  }
  50.1%, 100% {
      box-shadow: none;
  }
}
@keyframes terminal-underline {
  0%, 50% {
      box-shadow: 0 2px 0 #aaa;
      box-shadow: 0 calc(var(--line-thickness, 2) * 1px) 0 var(--original-color, #aaa);
  }
  50.1%, 100% {
      box-shadow: none;
  }
}
/* NONE ANIMATION */
@-webkit-keyframes terminal-none {
    0%, 100% {
        background-color: #aaa;
        background-color: var(--original-color, #aaa);
        color: #000;
        color: var(--original-background, #000);
        -webkit-box-shadow: 0 0 calc(var(--glow) * 3px) var(--color, #aaa);
        box-shadow: 0 0 calc(var(--glow) * 3px) var(--color, #aaa);
    }
}
@-moz-keyframes terminal-none {
    0%, 100% {
        background-color: #aaa;
        background-color: var(--original-color, #aaa);
        color: #000;
        color: var(--background, #000);
        -webkit-box-shadow: 0 0 calc(var(--glow) * 3px) var(--color, #aaa);
        box-shadow: 0 0 calc(var(--glow) * 3px) var(--color, #aaa);
    }
}
@keyframes terminal-none {
    0%, 100% {
        background-color: #aaa;
        background-color: var(--original-color, #aaa);
        color: #000;
        color: var(--original-background, #000);
        -webkit-box-shadow: 0 0 calc(var(--glow) * 3px) var(--color, #aaa);
        box-shadow: 0 0 calc(var(--glow) * 3px) var(--color, #aaa);
    }
}
.underline-animation .cmd .cmd-cursor.cmd-blink > span[data-text]:not(.emoji):not(.fa):not(.far):not(.fas) span,
.underline-animation .cmd .cmd-cursor.cmd-blink a,
.underline-animation .cmd .cmd-cursor.cmd-blink .fa,
.underline-animation .cmd .cmd-cursor.cmd-blink .far,
.underline-animation .cmd .cmd-cursor.cmd-blink .fas,
.underline-animation .cmd .cmd-cursor .emoji {
    -webkit-animation-name: terminal-underline;
       -moz-animation-name: terminal-underline;
        -ms-animation-name: terminal-underline;
            animation-name: terminal-underline;
}
.glow-animation .cmd .cmd-cursor.cmd-blink > span[data-text]:not(.emoji):not(.fa):not(.far):not(.fas) span,
.glow-animation .cmd .cmd-cursor.cmd-blink a,
.glow-animation .cmd .cmd-cursor.cmd-blink .fa,
.glow-animation .cmd .cmd-cursor.cmd-blink .far,
.glow-animation .cmd .cmd-cursor.cmd-blink .fas,
.glow-animation .cmd .cmd-cursor .emoji {
    -webkit-animation-name: terminal-glow;
       -moz-animation-name: terminal-glow;
        -ms-animation-name: terminal-glow;
            animation-name: terminal-glow;
}
.bar-animation .cmd .cmd-cursor.cmd-blink > span[data-text]:not(.emoji):not(.fa):not(.far):not(.fas) span,
.bar-animation .cmd .cmd-cursor.cmd-blink a,
.bar-animation .cmd .cmd-cursor.cmd-blink .fa,
.bar-animation .cmd .cmd-cursor.cmd-blink .far,
.bar-animation .cmd .cmd-cursor.cmd-blink .fas,
.bar-animation .cmd .cmd-cursor .emoji {
    -webkit-animation-name: terminal-bar;
       -moz-animation-name: terminal-bar;
        -ms-animation-name: terminal-bar;
            animation-name: terminal-bar;
}
/*
   Internet Explorer & Edge *, Safari ≤ 6
   source: https://w3reign.com/internet-explorer-edge-css-hacks/
*/


@supports (-ms-ime-align:auto) {
    .cmd .cmd-clipboard {
        margin-left: -9999px;
    }
    @keyframes terminal-blink {
        0%, 50% {
            background-color: var(--original-color, #aaa);
            color: var(--background, #000);
        }
        50.1%, 100% {
            background-color: var(--background, #000);
            color: var(--original-color, #aaa);
        }
    }
    @keyframes terminal-bar {
        0%, 50% {
            border-left-color: var(--color, #aaa);
        }
        50.1%, 100% {
            border-left-color: var(--background, #000);
        }
    }
    @keyframes terminal-underline {
        0%, 50% {
            border-bottom-color: var(--color, #aaa);
            line-height: 12px;
            line-height: var(--terminal-font-size);
        }
        50.1%, 100% {
            border-bottom-color: var(--background, #000);
            line-height: 12px;
            line-height: var(--terminal-font-size);
        }
    }
}
/* IE hack Edge one don't work in IE11 */
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    .cmd .cmd-clipboard {
        margin-left: -9999px;
    }
    .underline-animation .cursor.blink span span {
        margin-top: 1px;
    }
    @-ms-keyframes terminal-blink {
        0%, 50% {
            background-color: #aaa;
            color: #000;
        }
        50.1%, 100% {
            background-color: #000;
            color: #aaa;
        }
    }
}
.terminal .terminal-output .raw *::-moz-selection,
.terminal .terminal-output div div::-moz-selection,
.terminal .terminal-output div div a::-moz-selection,
.terminal .terminal-output span[data-text]::-moz-selection,
.terminal .terminal-output span[data-text]:not(.far):not(.fa):not(.fas) span::-moz-selection,
.terminal .terminal-output .raw div::-moz-selection,
.cmd span[data-text]::-moz-selection,
.cmd span[data-text]:not(.far):not(.fa):not(.fas) span::-moz-selection {
    background-color: #aaa;
    color: #000;
}
/* this don't work in Chrome
.terminal tr td::-moz-selection {
    border-color: #000;
}
.terminal tr td::selection {
    border-color: #000;
}
*/
/* fix selection/click on text that was echo without newline while prompt is relocated */
.terminal .cmd {
    pointer-events: none;
}
.terminal .cmd-prompt * {
    pointer-events: visible;
}
.cmd-prompt > span:first-child {
    margin-left: var(--prompt-offset);
}
.terminal .cmd-wrapper > div:not(.cmd-cursor-line),
.terminal .cmd-cursor-line > span,
.terminal .cmd textarea {
    pointer-events: visible;
}
.terminal .terminal-output .raw *::selection,
.terminal .terminal-output div div::selection,
.terminal .terminal-output div div a::selection,
.terminal .terminal-output span[data-text]::selection,
.terminal .terminal-output span[data-text]:not(.far):not(.fa):not(.fas) span::selection,
.terminal .terminal-output .raw div::selection,
.terminal-revese,
.cmd span[data-text]:not(.far):not(.fa):not(.fas) span::selection {
    /*
     * use rgba to fix transparent selection in chrome
     * http://stackoverflow.com/questions/7224445/css3-selection-behaves-differently-in-ff-chrome
     */
    background-color: rgba(170, 170, 170, 0.99);
    color: #000;
}

.terminal-output .emoji::-moz-selection,
.terminal-output .emoji span::-moz-selection,
.cmd .emoji::-moz-selection,
.cmd .emoji span::-moz-selection,
.cmd textarea::-moz-selection {
    background-color: transparent !important;
    color: transparent !important;
}
.terminal-output .emoji::selection,
.terminal-output .emoji span::selection,
.cmd .emoji span::selection,
.cmd .emoji::selection,
.cmd textarea::selection {
    background-color: transparent !important;
    color: transparent !important;
}

.terminal .terminal-output > :not(.raw) .terminal-error,
.terminal .terminal-output > :not(.raw) .terminal-error * {
    color: red;
    color: var(--error-color, red);
}
.tilda {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1100;
}
.ui-dialog-content .terminal {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}
.ui-dialog .ui-dialog-content.dterm {
    padding: 0;
}
.clear {
    clear: both;
}
.terminal .terminal-fill {
    position: absolute;
    left: 0;
    top: -100%;
    width: 100%;
    height: 100%;
    margin: 1px 0 0;
    border: none;
    opacity: 0.01;
    pointer-events: none;
    box-sizing: border-box;
}
.terminal-scroller, .terminal .terminal-fill, .cmd-editable {
    padding: calc(1px * var(--padding, 10) / var(--pixel-density, 1));
}
.cmd-editable {
    padding-top: 0;
}
/* padding added as margin to .cmd to fix FireFox bug see: https://stackoverflow.com/q/29986977/387194 */
.terminal-scroller {
    padding-bottom: 0;
}
.terminal .terminal-output > :not(.raw) .terminal-error,
.terminal .terminal-output > :not(.raw) .terminal-error * {
    --color: var(--error-color, red);
    text-shadow: 0 0 calc(var(--glow) * 5px) var(--color);
}
.terminal .terminal-output > :not(.raw) a[href] {
    text-shadow: 0 0 calc(var(--glow) * 5px) var(--color);
}
.terminal .cmd {
    margin-bottom: calc(1px * var(--padding, 10) / var(--pixel-density, 1));
    position: relative;
}
.terminal .partial, .terminal .partial > div {
    display: inline-block;
}
@supports (--css: variables) {
    .terminal,
    .terminal-output > :not(.raw) span[data-text]:not(.token):not(.inverted):not(.terminal-inverted):not(.cmd-inverted):not(.terminal-error):not(.emoji),
    .terminal-output > :not(.raw) a,
    .terminal-output > :not(.raw) div,
    .cmd,
    .cmd span[data-text]:not(.cmd-inverted):not(.token):not(.emoji),
    .terminal.external [data-text],
    .cmd div {
        color: var(--color, #aaa);
        background-color: var(--background, #000);
    }
    .terminal {
        --terminal-line: calc(var(--size, 1) * (16px / var(--pixel-density, 1)) + 1px / var(--pixel-density, 1));
        --terminal-font-size: calc(var(--size, 1) * (12px / var(--pixel-density, 1)));
        height: auto;
        /* force size when user add --rows and --cols */
        height: calc((var(--terminal-line) * var(--rows)) + (var(--padding, 10) * 2px));
        /*
         * there is a bug in Chromium https://issues.chromium.org/issues/379430924
         * it give wrong number of characters per line (off by one),
         * it works fine in Firefox and Epiphany
         */
        width: calc((var(--cols) * 1ch) + (var(--padding, 10) * 2px) + (var(--terminal-scrollbar, 10) * 1px));
    }
    .terminal .terminal-output > :not(.raw) > div,
    .cmd div,
    .terminal,
    .terminal.external div {
        line-height: round(var(--terminal-line, 1em));
    }
    .terminal [data-text], .cmd [data-text] {
        /* conditionals: https://www.kizu.ru/conditions-for-css-variables/ */
        /* --glow: 0; */
        text-shadow: var(--text-shadow, 0 0 calc(var(--glow) * 5px) var(--color, #ccc));
    }
    .terminal span[style*="--length"] {
        /*
         * default value for char-width taken from Google Chrome for default font
         * to silence warning in webpack #371
         */
        width: calc(var(--length, 1) * var(--char-width, 7.23438) * 1px);
        display: inline-block;
    }
    .terminal,
    .terminal-output > :not(.raw) span,
    .terminal-output > :not(.raw) a,
    .terminal-output > :not(.raw) div {
        font-size: var(--terminal-font-size);
    }
    .cmd,
    .cmd span,
    .cmd div {
        --cmd-font-size: var(--terminal-font-size, calc(var(--size, 1) * (12px / var(--pixel-density, 1))));
        font-size: var(--cmd-font-size);
    }
    .terminal-output .emoji, .cmd .emoji {
        height: var(--terminal-font-size);
    }
    .cmd .clipboard {
        top: calc(var(--size, 1) * (14 / var(--pixel-density, 1)) * var(--cursor-line, 0) * 1px);
    }
    .terminal span[style*="--background"],
    .cmd span[style*="--background"] {
        --base-background: var(--background);
    }
    .terminal .inverted > span,
    .terminal .terminal-inverted > span,
    .cmd.cmd.cmd .inverted,
    .cmd.cmd.cmd .cmd-inverted {
        background-color: var(--color, #aaa) !important;
        color: var(--base-background, #000) !important;
    }
    .cmd .cmd-cursor.cmd-blink {
        color: var(--color, #aaa);
        background-color: var(--background, #000);
    }
    .cmd .cmd-cursor.cmd-blink > span[data-text]:not(.emoji):not(.fa):not(.far):not(.fas) span,
    .cmd .cmd-cursor.cmd-blink a,
    .cmd .cmd-cursor.cmd-blink .fa,
    .cmd .cmd-cursor.cmd-blink .far,
    .cmd .cmd-cursor.cmd-blink .fas,
    .cmd .cmd-cursor.cmd-blink .emoji {
        -webkit-animation: var(--animation, terminal-blink) 1s infinite linear;
           -moz-animation: var(--animation, terminal-blink) 1s infinite linear;
            -ms-animation: var(--animation, terminal-blink) 1s infinite linear;
                animation: var(--animation, terminal-blink) 1s infinite linear;
        --original-background: inherit;
    }
    .cmd .cmd-cursor.cmd-blink .emoji span {
        color: transparent;
        background: transparent;
    }
    .terminal .terminal-output .raw *::-moz-selection,
    .terminal .terminal-output div div::-moz-selection,
    .terminal .terminal-output div div a::-moz-selection,
    .terminal .terminal-output span[data-text]::-moz-selection,
    /*
     * font icons (fontawesome) don't render selection we make emoji the same becuase,
     * selection on emoji looks weird
     */
    .terminal .terminal-output span[data-text]:not(.far):not(.fa):not(.fas):not(.emoji) span::-moz-selection,
    .terminal .terminal-output .raw div::-moz-selection,
    .cmd span[data-text]:not(.far):not(.fa):not(.fas):not(.emoji) span::-moz-selection {
        background-color: var(--color, #aaa);
        color: var(--background, #000);
    }
    .terminal .terminal-output div div a::-moz-selection {
        background-color: var(--link-color, rgba(15, 96, 255, 0.99)) !important;
        color: var(--background, #000) !important;
    }
    .terminal .terminal-output div div a:hover::-moz-selection {
        background-color: var(--link-color, rgba(2, 50, 144, 0.99)) !important;
    }
    .terminal .terminal-output .raw *::selection,
    .terminal .terminal-output div div::selection,
    .terminal .terminal-output div div a::selection,
    .terminal .terminal-output span[data-text]:not(.emoji)::selection,
    .terminal .terminal-output span[data-text]:not(.far):not(.fa):not(.fas):not(.emoji) span::selection,
    .terminal .terminal-output .raw div::selection,
    .cmd span[data-text]:not(.far):not(.fa):not(.fas):not(.emoji) span::selection {
        background-color: var(--color, rgba(170, 170, 170, 0.99)) !important;
        color: var(--background, #000) !important;
    }
    .terminal .terminal-output div div a::selection {
        background-color: var(--link-color, rgba(15, 96, 255, 0.99)) !important;
        color: var(--background, #000) !important;
    }
    .terminal .terminal-output div div a:hover::selection {
        background-color: var(--link-color, rgba(2, 50, 144, 0.99)) !important;
    }
}
/*
 * overwrite css variables that don't work with selection in Edge
 */
@property --color {
    syntax: '<color>';
    inherits: true;
    initial-value: rgba(170, 170, 170, 0.99);
}
@property --background {
    syntax: '<color>';
    inherits: true;
    initial-value: #000;
}
@property --link-color {
    syntax: '<color>';
    inherits: true;
    initial-value: #3377FF;
}
@property --size {
    syntax: '<number>';
    inherits: true;
    initial-value: 1;
}
@property --padding {
    syntax: '<number>';
    inherits: true;
    initial-value: 10;
}
@property --rows {
    syntax: '<number> | auto';
    inherits: true;
    initial-value: auto;
}
@property --cols {
    syntax: '<number> | auto';
    inherits: true;
    initial-value: auto;
}
@supports (-ms-ime-align:auto) {
    .terminal h1::selection,
    .terminal h2::selection,
    .terminal h3::selection,
    .terminal h4::selection,
    .terminal h5::selection,
    .terminal h6::selection,
    .terminal pre::selection,
    .terminal td::selection,
    .terminal .terminal-output div div::selection,
    .terminal .terminal-output div div a::selection,
    .cmd span[data-text]::selection {
        background-color: rgba(170, 170, 170, 0.99);
        color: #000;
    }
}
/* PrismJS style overwrites */
.terminal .token.token,
.terminal .token.operator,
.terminal .token.entity,
.terminal .token.variable,
.terminal .token.url,
.terminal .token.string,
.terminal .style .token.string,
.terminal .token.token,
.cmd .token.operator,
.cmd .token.entity,
.cmd .token.variable,
.cmd .token.url,
.cmd .token.string,
.cmd .style .token.string,
.cmd .token.token {
    background-color: inherit;
}
/* FireFox hack
@supports (-moz-animation: foo) {
    .terminal,
    .terminal .terminal-output > :not(.raw) span,
    .terminal .terminal-output > :not(.raw) a,
    .terminal .terminal-output > :not(.raw) div,
    .cmd,
    .cmd span,
    .cmd div {
        line-height: calc(var(--size, 1) * 13px);
    }
}
*/
/* style for autocomplete menu */
.cmd .cursor-wrapper ul {
    list-style: none;
    margin: 0;
    padding: 0;
    float: left;
    position: absolute;
    top: 14px;
    left: 0;
}
.cmd .cursor-wrapper li {
    cursor: pointer;
    white-space: nowrap;
}
.cmd .cursor-wrapper li:hover {
    background: #aaa;
    color: #000;
}
.cursor-wrapper {
    position: relative;
}
.terminal-output img {
    vertical-align: top;
}
.cmd img {
    height: 14px;
    height: calc(var(--size, 1) * (14px / var(--pixel-density, 1)));
    border: 1px solid transparent;
}
.cmd-cursor img {
    border-color: #ccc;
    border-color: var(--color, #ccc);
}
.terminal-output svg.terminal-broken-image {
    height: calc(var(--size, 1) * (14px / var(--pixel-density, 1)));
}
.terminal-output svg.terminal-broken-image use {
    fill: var(--color, #ccc);
}
.terminal-error {
    --color: var(--error-color);
}
.terminal-glow {
    --animation: terminal-glow;
}
.terminal-glow span[data-text],
.terminal-glow .cmd-prompt > span,
.terminal-glow a[data-text],
.terminal-glow [data-text] span,
.terminal-glow .terminal-output > div span,
.terminal-glow .terminal-output > div a[href] {
    text-shadow: 1px 1px 5px #ccc;
    text-shadow: 1px 1px 5px var(--color, #ccc);
}
/* is_bottom detection */
.terminal-scroll-marker {
    position: relative;
    height: 1px;
    height: calc(1px / var(--pixel-density, 1));
    margin-top: -1px;
    margin-top: calc(-1px / var(--pixel-density, 1));
    z-index: 100;
}
.terminal-scroll-marker div {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 200;
}
.terminal-less {
    touch-action: none;
    overscroll-behavior-y: contain;
}
/*
 * mobile scroll fix, with help from StackOverflow
 * https://stackoverflow.com/a/60535925/387194
 */
.terminal-mobile.terminal-less .terminal-wrapper {
    pointer-events: none;
}
.terminal-mobile.terminal-less .terminal-output a, .cmd-editable {
    pointer-events: visible;
}
.cmd-editable::before {
    content: attr(data-cmd-prompt);
    display: inline-block;
}
.cmd-editable {
    position: absolute;
    top: calc(var(--cmd-top) * 1px + var(--cmd-font-size, 1em));
    bottom: 0;
    right: 0;
    left: 0;
    z-index: 500;
    color: transparent;
    background: transparent;
    opacity: 0.01;
    outline: 0px solid transparent;
}
/* Scrollbar */
.terminal-scroller::-webkit-scrollbar {
    width: calc(6px / var(--pixel-density, 1));
    height: calc(6px / var(--pixel-density, 1));
    background: var(--background, #000);
}
.terminal-scroller::-webkit-scrollbar-thumb {
    background: var(--color, #aaa);
}
.terminal-scroller::-webkit-scrollbar-thumb:hover {
    background: var(--color, #aaa);
}
.terminal-scroller {
    scrollbar-color: #aaa #000;
    scrollbar-color: var(--color, #aaa) var(--background, #000);
    scrollbar-width: thin;
}

/* visially hidden */
.terminal-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0,0,0,0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}
/*
 * Allow to change scrollbar color
 */
.terminal-wrapper {
    --color: var(--base-color);
    --background: var(--base-background);
}
.cmd .token {
    --original-color: var(--color);
}
.terminal .terminal-blink, .cmd .terminal-blink {
    animation: terminal-ansi-blink 1s steps(2, start) infinite;
    -webkit-animation: terminal-ansi-blink 1s steps(2, start) infinite;
}
/* Allow transparent background #698 */
.terminal .terminal-output,
.terminal .terminal-output * {
  --background: transparent;
}
.terminal .cmd * {
  --background: transparent;
}
.terminal .cmd::selection,
.terminal .cmd *::selection,
.terminal .terminal-output::selection,
.terminal .terminal-output *::selection {
  --background: var(--base-background);
}
@keyframes terminal-ansi-blink {
    to {
        color: var(--background);
    }
}
@-webkit-keyframes terminal-ansi-blink {
    to {
        color: var(--background);
     }
}
@media (prefers-reduced-motion) {
    :root {
        --animation: terminal-none;
    }
}
